﻿<DemoPageSectionComponent Id="Editors-Common-Validation-CustomForm" ShowSizeMode="true">
    <ChildContentWithParameters Context="Params">
        @using BlazorDemo.Data.Annotations
        @using BlazorDemo.Pages.Editors.Common.Models
        @using Microsoft.AspNetCore.Components

        <div class="cw-880">
            <EditForm Model="@starship"
                      OnValidSubmit="@HandleValidSubmit"
                      OnInvalidSubmit="@HandleInvalidSubmit"
                      class="w-800">

                <DataAnnotationsValidator />

                <div class="row">
                    <div class="col-md-6" style="padding-bottom: 12px">
                        <label for="identifierInputId" class="demo-text mb-1">
                            Identifier:
                        </label>
                        <DxTextBox InputId="identifierInputId" @bind-Text="@starship.Identifier" SizeMode="Params.SizeMode" ShowValidationIcon="true" />
                        <ValidationMessage For="@(() => starship.Identifier)" />
                    </div>

                    <div class="col-md-6" style="padding-bottom: 12px">
                        <label for="classificationInputId" class="demo-text mb-1">
                            Primary Classification:
                        </label>
                        <DxComboBox InputId="classificationInputId"
                                    NullText="Select classification ..."
                                    ClearButtonDisplayMode="DataEditorClearButtonDisplayMode.Auto"
                                    Data="classifications"
                                    TextFieldName="Value"
                                    ValueFieldName="Id"
                                    @bind-Value="@starship.Classification"
                                    SizeMode="Params.SizeMode" ShowValidationIcon="true" />
                        <ValidationMessage For="@(() => starship.Classification)" />
                    </div>

                    <div class="col-md-6" style="padding-bottom: 12px">
                        <label for="accommodationInputId" class="demo-text mb-1">Maximum Accommodation: </label>
                        <DxSpinEdit InputId="accommodationInputId" @bind-Value="@starship.MaximumAccommodation" SizeMode="Params.SizeMode" ShowValidationIcon="true" />
                        <ValidationMessage For="@(() => starship.MaximumAccommodation)" />
                    </div>

                    <div class="col-md-6" style="padding-bottom: 12px">
                        <label for="productionDateInputId" class="demo-text mb-1">
                            Production Date:
                        </label>
                        <DxDateEdit InputId="productionDateInputId" @bind-Date="@starship.ProductionDate" SizeMode="Params.SizeMode" ShowValidationIcon="true" />
                        <ValidationMessage For="@(() => starship.ProductionDate)" />
                    </div>

                    <div class="col-md-6" style="padding-bottom: 12px">
                        <fieldset>
                            <legend class="demo-text mb-0">
                                Engine Type:
                            </legend>
                            <DxRadioGroup @bind-Value="@starship.Engine"
                                          Items="@(Enum.GetValues(typeof(Engine)).Cast<Engine>())"
                                          Layout="@RadioGroupLayout.Horizontal"
                                          SizeMode="@Params.SizeMode" />
                        </fieldset>
                        <ValidationMessage For="@(() => starship.Engine)" />
                    </div>

                    <div class="col-md-12">
                        <DxButton SubmitFormOnClick="true" Text="Submit" RenderStyle="ButtonRenderStyle.Secondary" SizeMode="Params.SizeMode" />
                    </div>
                </div>

                <p class="demo-text w-100 mt-4">
                    Form Validation State:
                    <b>@FormValidationState</b>
                </p>
            </EditForm>
        </div>
    </ChildContentWithParameters>

    @code {
        string FormValidationState = @"Press the ""Submit"" button to validate the form.";

        Starship starship = new() {
            ProductionDate = DateTime.Now + TimeSpan.FromDays(1),
            Description = "Default description"
        };

        List<Classification> classifications = new() {
            new(1, "Defense"),
            new(2, "Exploration"),
            new(3, "Diplomacy")
        };

        void HandleValidSubmit() {
            FormValidationState = @"Form data is valid";
        }

        void HandleInvalidSubmit() {
            FormValidationState = @"Form data is invalid";
        }

    }

</DemoPageSectionComponent>
